import React from "react";
import "../css/Home.css"
import companyprofile from "./companyprofile"
import team from "./team"
import culture from "./culture"
import experience from "./experience"
import journalism from "./journalism"
import millet from "./millet"
import investment from "./investment"
import contact from "./contact"



import {
    HashRouter,//路由模式：嵌套路由模式要跟随上级路由模式
    Switch,//将路由设置为拍他路由
    Route,//将路由对象/组件
    Link,
} from "react-router-dom";

class Home extends React.Component {
    constructor(props) {
        super(props)
    }
    render() {
        return (
            <div className="home_container">
                <div className="home_container_top">
                    <div className="home_container_top_left">
                        <ul>
                            <li>小米商城&nbsp;| </li>
                            <li>MIUI&nbsp;| </li>
                            <li>loT&nbsp;| </li>
                            <li>云服务&nbsp;| </li>
                            <li>天星数科&nbsp;| </li>
                            <li>有品&nbsp;| </li>
                            <li>小爱开放平台&nbsp;| </li>
                            <li>企业团购&nbsp;| </li>
                            <li>资质证照&nbsp;| </li>
                            <li>协议规则&nbsp;| </li>
                            <li>下载APP&nbsp;| </li>
                            <li>智能生活&nbsp;| </li>
                            <li>Sllect Location&nbsp;| </li>
                        </ul>
                    </div>
                    <div className="home_container_top_right">
                        <ul>
                            <li onClick={() => {
                                // this.props.history.push({
                                //     pathname: '/login'
                                // })
                                // this.props.history.push("/login")
                                console.log(this.props)
                            }}>登录</li>
                            <li>注册</li>
                            <li>消息信息</li>
                        </ul>

                    </div>
                </div>
                <div className="home_container_header">
                    <div className="home_container_header_img">

                    </div>
                    <div className="home_container_header_list">
                        <ul>
                            <li>全部商品分类</li>
                            <li>小米手机</li>
                            <li>Redmi红米</li>
                            <li>电视</li>
                            <li>笔记本</li>
                            <li>家电</li>
                            <li>路由器</li>
                            <li>智能硬件</li>
                            <li>服务</li>
                            <li>社区</li>
                        </ul>
                    </div>
                    <div className="home_container_header_input">
                        <input type="text" placeholder="卡丁车"></input></div>
                </div>
                <HashRouter>
                    <div className="home_container_buttom">
                        <div className="home_container_buttom_brief">
                            <ul>
                                <li><Link to="/companyprofile" style={{ textDecoration: 'none' }} >公司简介&nbsp;&nbsp;&nbsp;|</Link></li>
                                <li><Link to="/team" style={{ textDecoration: 'none' }} >管理工具&nbsp;&nbsp;&nbsp;|</Link></li>
                                <li><Link to="/culture" style={{ textDecoration: 'none' }} >小米文化&nbsp;&nbsp;&nbsp;|</Link></li>
                                <li><Link to="/experience" style={{ textDecoration: 'none' }} >发展经历&nbsp;&nbsp;&nbsp;|</Link></li>
                                <li><Link to="/journalism" style={{ textDecoration: 'none' }} >小米新闻&nbsp;&nbsp;&nbsp;|</Link></li>
                                <li><Link to="/millet" style={{ textDecoration: 'none' }} >加入小米&nbsp;&nbsp;&nbsp;|</Link></li>
                                <li><Link to="/investment" style={{ textDecoration: 'none' }} >投资者关系&nbsp;&nbsp;&nbsp;|</Link></li>
                                <li><Link to="/contact" style={{ textDecoration: 'none' }} >联系我们&nbsp;&nbsp;&nbsp;|</Link></li>


                            </ul>
                        </div>

                    </div>
                    <Switch>

                        <div className="router-img">

                            <Route path="/team" component={team}></Route >
                            <Route path="/culture" component={culture}></Route >
                            <Route path="/experience" component={experience}></Route >
                            <Route path="/journalism" component={journalism}></Route >
                            <Route path="/millet" component={millet}></Route >
                            <Route path="/investment" component={investment}></Route >
                            <Route path="/contact" component={contact}></Route >
                            <Route path="/companyprofile" component={companyprofile}></Route >
                        </div>
                    </Switch>
                </HashRouter>

            </div>
        )






    }
}
export default Home;